article,
aside,
figcaption,
figure,
footer,
header,
nav,
section,
  display: block

*
  box-sizing: border-box

html
  background: #fff
  color: $default-text-color
  font: 400 14px/1.7 $default-font-stack
  text-rendering: optimizeLegibility
  -ms-text-size-adjust: 100%
  -webkit-text-size-adjust: 100%

body, p, ul, ol, li, pre,
h1, h2, h3, h4, h5, h6
  margin: 0
  padding: 0
  list-style: none

b, strong
  font-weight: 600

a
  color: $default-link-color
  font-weight: 600
  text-decoration: none
  transition: color 0.2s ease-out

  &:hover,
  &:active
    color: $hover-link-color

  &:active
    position: relative
    top: 1px

pre
  @extend %word-wrap
  text-align: left !important

code
  font: 1.15em $code-font-stack
  font-weight: normal !important
  color: $dimmed-text-color
  -webkit-font-smoothing: antialiased

input, button, a.button
  -webkit-appearance: none
  display: block
  width: 100%
  margin: 0
  padding: 1rem
  border: 1px solid $content-border-color
  border-radius: 2 * $diff-border-radius
  background: #fff
  color: inherit
  font: inherit
  line-height: normal
  transition: border-color 0.2s ease-out, color 0.2s ease-out, background 0.2s ease-out

  &:focus,
  &:active
    outline: none

  &::placeholder
    color: $dimmed-text-color
    font-weight: 300

  &::-moz-focus-inner
    border: 0
    padding: 0

input[type="submit"], button, a.button
  padding-right: 0
  padding-left: 0
  border-color: mix($brand-orange, $content-border-color)
  color: $brand-orange
  text-align: center
  cursor: pointer

  &:hover,
  &:focus,
  &:active
    border-color: $brand-orange
    background: $brand-orange
    color: $brand-light-yellow

  &:active
    position: relative
    top: 1px

::selection
  background: $brand-orange
  color: #fff
  text-shadow: none
